<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>西安文化体验网站</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header class="header">
        <div class="container">
            <h1 class="logo">西安文化之旅</h1>
            <nav class="nav">
                <ul class="nav-list">
                    <li><a href="#home" class="nav-link active">首页</a></li>
                    <li><a href="food.html" class="nav-link">西安美食</a></li>
                    <li><a href="travel.html" class="nav-link">旅游景点</a></li>
                    <li><a href="poetry.html" class="nav-link">唐诗体验</a></li>
                    <li><a href="dialect.html" class="nav-link">陕西话</a></li>
                </ul>
            </nav>
        </div>
    </header>

    <main class="main">
        <section class="hero">
            <div class="hero-content">
                <h2 class="hero-title">探索千年古都西安</h2>
                <p class="hero-subtitle">品味美食 · 游览古迹 · 体验诗韵 · 学习方言</p>
            </div>
        </section>

        <section class="features">
            <div class="container">
                <div class="feature-grid">
                    <div class="feature-card" onclick="location.href='food.html'">
                        <div class="feature-icon"><img src="images/roujiamo.svg" alt="西安美食" width="40" height="40"></div>
                        <h3 class="feature-title">西安美食</h3>
                        <p class="feature-desc">品尝正宗的西安小吃，感受千年古都的美食文化</p>
                        <div class="feature-arrow">→</div>
                    </div>

                    <div class="feature-card" onclick="location.href='travel.html'">
                        <div class="feature-icon"><img src="images/terracotta.svg" alt="旅游景点" width="40" height="40"></div>
                        <h3 class="feature-title">旅游景点</h3>
                        <p class="feature-desc">探索兵马俑、大雁塔等著名景点，规划完美旅游路线</p>
                        <div class="feature-arrow">→</div>
                    </div>

                    <div class="feature-card" onclick="location.href='poetry.html'">
                        <div class="feature-icon"><img src="images/poetry.svg" alt="唐诗体验" width="40" height="40"></div>
                        <h3 class="feature-title">唐诗体验</h3>
                        <p class="feature-desc">欣赏经典唐诗，与AI一起创作属于你的诗歌</p>
                        <div class="feature-arrow">→</div>
                    </div>

                    <div class="feature-card" onclick="location.href='dialect.html'">
                        <div class="feature-icon"><img src="images/dialect.svg" alt="陕西话" width="40" height="40"></div>
                        <h3 class="feature-title">陕西话</h3>
                        <p class="feature-desc">学习地道的陕西方言，体验西安人的语言魅力</p>
                        <div class="feature-arrow">→</div>
                    </div>
                </div>
            </div>
        </section>

        <section class="about">
            <div class="container">
                <h2 class="section-title">关于西安</h2>
                <p class="about-text">
                    西安，古称长安，是中华文明的重要发祥地之一。这座拥有三千多年建城史的古都，
                    见证了十三个王朝的兴衰更替，承载着深厚的历史文化底蕴。从秦始皇兵马俑到大雁塔，
                    从回民街的美食到城墙的雄伟，西安以其独特的魅力吸引着世界各地的游客。
                </p>
            </div>
        </section>
    </main>

    <footer class="footer">
        <div class="container">
            <p>&copy; 2024 西安文化体验网站. 探索古都魅力，传承文化精神.</p>
        </div>
    </footer>

    <script src="script.js"></script>
</body>
</html>